<template>
  <div class="list">
    <div class="list-ms">
        <!-- <img src="./image/shouye_icon_naozhong.png" alt=""> -->
        <img src="./image/shouye_icon_miaosha.png" @click="$router.push({path:'/home/seckill'})" alt="">
        <img src="./image/shouye_icon_miaosha2.png" alt="">
    </div>
     <div class="list-one" @click="$router.push({name:'comment'})">
        <img src="./image/shouye_icon_lefan.png" alt="">
        <h3>乐凡水乳</h3>
        <van-rate 
        v-model="value" 
        color="#ffd21e"
        :size="13"
        :count="4" />
        <p>皮肤状态： 中性·泛红·敏感</p>
     </div>
   <div class="list-two">
    <img src="./image/shouye_icon_fulifangsi.png" alt="">
        <h3>芙丽芳丝洗面奶</h3>
        <van-rate 
        v-model="value2" 
        color="#ffd21e"
        :size="13"
        :count="5" />
        <p>皮肤状态：轻油·轻敏·非色素</p>
   </div>

   <div class="list-two">
    <img src="./image/shouye_icon_aierboshi.png" alt="">
        <h3>瑷尔博士水乳</h3>
        <van-rate 
        v-model="value2" 
        color="#ffd21e"
        :size="13"
        :count="5" />
        <p>皮肤状态：混油·轻敏·痘肌</p>
   </div>

  </div> 
</template>

<script>
export default {
    data(){
        return{
            value:4,
            value2:5
        }
    }
}
</script>

<style scoped>
    .list{
        display: flex;
        flex-wrap: wrap;
        margin-top: 20px;
        width: 43.625rem;
        margin-left: 1.5625rem;
        justify-content: space-between;
    }
    .list-ms{
        width: 20.9375rem;
        height: 23.125rem;
        opacity: 1;
        margin-bottom: 20px;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }
    .list img{
        width: 100%;
        /* height: 14.875rem; */
    }
    .list-one{
        width: 20.9375rem;
        height: 23.125rem;
        background: #FFFFFF;
        opacity: 1;
    }
    .list-one h3{
        width: 7.5rem;
        height: 2.625rem;
        font-size: 1.875rem;
        font-family: PingFangSC-Regular-, PingFangSC-Regular;
        font-weight: normal;
        color: #060606;
        line-height: 2.25rem;
    }
    .list-one p{
        width: 18rem;
        height: 2.0625rem;
        font-size: 1.5rem;
        font-family: PingFangSC-Regular-, PingFangSC-Regular;
        font-weight: normal;
        color: #595A5C;
        line-height: 1.8125rem;
    }
    .list-two{
        width: 21rem;
        height: 25rem;
        background: #FFFFFF;
        /* border-radius: 0px 0px 0px 0px; */
        opacity: 1;
    }
    .list-two h3{
        width: 7.5rem;
        height: 2.625rem;
        font-size: 1.875rem;
        font-family: PingFangSC-Regular-, PingFangSC-Regular;
        font-weight: normal;
        color: #060606;
        line-height: 2.25rem;
    }
    .list-two p{
        width: 300px;
        height: 2.0625rem;
        font-size: 1.5rem;
        font-family: PingFangSC-Regular-, PingFangSC-Regular;
        font-weight: normal;
        color: #595A5C;
        line-height: 1.8125rem;
    }
    .list-two h3{
        width: 210px;
    }
    /* 评分 */
    .van-rate{
        margin-top: .625rem;
        margin-bottom: .9375rem;
    }
</style>